@charset "utf-8";
/* CSS Document */
* {font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif; margin:0px; padding:0px}

#content{ width:100%; margin:auto}
.video-container{width: 900px; height:506px; position:relative}
.aviso{display: none; font-weight:bold}
.titulo{ background-color:#be0030; color:#ffffff; width:900px; padding-top:2em; padding-bottom:1.5em;}
.titulo h2{text-align:center; margin-bottom:1em;}
.titulo p{text-align:center}
.app{width:900px; text-align:center; padding:25px 0 15px 0}
.app a{color:#333333;}
.app p{ display:inline; margin-right:1.2em; font-weight:bold}

@media screen and (max-width: 399px) {
	.video-container{display:none}
	.aviso{display: block !important; padding-top:35%; text-align:center; max-width:80%; margin:auto; color:#ffffff}
	.titulo{display: none;}
	.titulo p{text-align:center; max-width:300px}
	body{background-color:#be0030}
	.app{display:none;}
	.gira{width:100px; margin:auto; margin-bottom:1.5em;}
}

@media screen and (min-width : 400px) and (max-width : 766px) {
	.video-container{ width:100%;}
	.titulo{width:100%}
	.titulo h1{max-width:70%px;}
	.titulo p{ position:relative; max-width:70%px; margin:auto}
	.app{width:100%; text-align:center; padding:25px 0 18px 0}
	.app p{ display:block; margin-right:none}
	
}